<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>OUAT</title>
<link rel="stylesheet"
	href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />

<!-- jQuery and jQuery Mobile -->
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>


<body>
	<div data-role="page">
		<c:import url="common/header.jsp" />
		<div data-role="content" class="ui-content" role="main">
			<ul data-role="listview" class="ui-listview">
				<li data-corners="false" data-shadow="false" data-iconshadow="true"
					data-wrapperels="div" data-icon="arrow-r" data-iconpos="right"
					data-theme="c">
							<a href="story/noread.do" class="ui-link-inherit">
								<h3 class="ui-li-heading">읽지 않은 동화</h3>
								<p class="ui-li-desc">읽지 않은 서브 타이틀</p>
							</a>
				</li>
				<c:forEach items="${categoryList }" var="cate">
				<li data-corners="false" data-shadow="false" data-iconshadow="true"
					data-wrapperels="div" data-icon="arrow-r" data-iconpos="right"
					data-theme="c">
							<a href="story/list.do?category_id=${cate.category_id }" class="ui-link-inherit">
								<h3 class="ui-li-heading">${cate.category_name }</h3>
								<p class="ui-li-desc">${cate.category_desc }</p>
							</a>
				</li>
				</c:forEach>
			</ul>
		</div>
		<c:import url="common/footer.jsp" />
	</div>
</body>
</html>
